<template>
    <div>
        <el-form
            :model="adminForm"
            status-icon
            ref="adminForm"
            label-width="100px"
            class="demo-ruleForm"
        >
            <el-form-item label="用户名" prop="name">
                <el-input v-model="adminForm.admin_name"></el-input>
            </el-form-item>
            <el-form-item label="密码" prop="pwd">
                <el-input type="password" v-model="adminForm.admin_pwd" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="submitForm('adminForm')">登录</el-button>
                <el-button @click="resetForm('adminForm')">重置</el-button>
                <!-- <el-button @click="register">注册</el-button> -->
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
import { login, regist } from "../util/myRequests";

export default {
    name: "loginComponent",
    data() {
        return {};
    },
    computed: {
        adminForm() {
            return this.$store.state.adminForm;
        },
    },
    methods: {
        register(){
            regist(this.adminForm)
                .then((res) => {
                    this.$store.commit("setAdminForm", res);
                    this.$emit("registSuccess");
                })
                .catch(error => console.log(error))
        },
        submitForm(formName) {
            login(this.adminForm)
                .then((res) => {
                    console.log(res)
                    this.$store.commit("setAdminForm", res);
                    this.$cookies.set("admin_id", res.admin_id);
                    this.$cookies.set("admin_name", res.admin_name);
                    this.$cookies.set("admin_nickname", res.admin_nickname);
                    this.$emit("loginSuccess");
                })
                .catch((error) => console.log(error));
            // this.$refs[formName].validate((valid) => {
            //   if (valid) {
            //     alert('submit!');
            //   } else {
            //     console.log('error submit!!');
            //     return false;
            //   }
            // });
        },
        resetForm(formName) {
            this.$refs[formName].resetFields();
        },
    },
};
</script>

<style>
</style>